<!DOCTYPE html>
<html lang="en" xmlns:150px xmlns:150px xmlns:150px xmlns:150px>
<head>
    <meta charset="UTF-8">
    <title>案列</title>
    <style type="text/css">
        tr{height: 20px;}
        th,td{width:150px;text-align-last: center;}
    </style>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="0">
    <tr>
        <th colspan="4">学生信息</th>
    </tr>
    <tr>
        <th>学号</th>
        <th>学生姓名</th>
        <th>年龄</th>
        <th>操作</th>
    </tr>
    <tr>
    <td>1</td>
    <td>张三</td>
    <td>20</td>
    <td>
    <input type="button" value="删除" onclick="deleteStudent(this)">
    </td>
</tr>
    <tr>
        <td>2</td>
        <td>李四</td>
        <td>20</td>
        <td>
            <input type="button" value="删除" onclick="deleteStudent(this)">
        </td>
    </tr>
    <tr>
        <td>3</td>
        <td>王五</td>
        <td>20</td>
        <td>
            <input type="button" value="删除" onclick="deleteStudent(this)">
        </td>
    </tr>
</table>
学号　：<input type="text" id="styId"><br>
学生姓名：<input type="text" id="stuName"><br>
年龄：<input type="text" id="stuAge"><br>
<input type="button" value="添加" id="btn">

<script type="text/javascript">
    function deleteStudent(obj) {
        if (confirm("确认要删除吗?")) {
            obj.parentElement.parentElement.remove();
        }
    }
    var btn = document.getElementById("bth");
    btn.onclick = function () {
        //获取学号,学生姓名,年龄
        var stuId = document.getElementById("stuId").value;
        var stuName = document.getElementById("stuName").value;
        var stuAge = document.getElementById("stuAge").value;
        //创建一个tr标签
        var tr = document.createElement("tr");
        //将学号,学生姓名,年龄拼接到tr中
        tr.innerHTML = "<td>"+stuId+"</td><td>"+stuName+"</td><td>"+stuAge+"</td><td><input type=\"button\" value=\"删除\" onclick=\"deleteStudent(this)\"></td>";
        //将tr添加到表格的最后一行
        var tb = document.querySelector("table");
        tb.appendChild(tr);
        //清空学生信息
        document.getElementById("stuId").value="";
        document.getElementById("stuName").value="";
        document.getElementById("stuAge").value="";
    };
</script>
</body>
</html>